<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title> - 素材上传</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico">
    <link href="/front/hAdmin/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="/front/hAdmin/css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="/front/hAdmin/css/animate.css" rel="stylesheet">

    <link href="/front/hAdmin/css/plugins/dropzone/basic.css" rel="stylesheet">
    <link href="/front/hAdmin/css/plugins/dropzone/dropzone.css" rel="stylesheet">
    <link href="/front/hAdmin/css/style.css?v=4.1.0" rel="stylesheet">

</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeIn">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>文件上传</h5>
                    <div class="ibox-tools">
                        <i class="icon-hand-right"></i>
                        统一定价添加:&nbsp
                        <select>
                            <option selected value="price">定价</option>
                        </select>
                        <input type="number" id="price" name="price" min=0 step=0.01 value=0></br>
                    </div>
                </div>
                <div class="ibox-content">
                    <form id="my-awesome-dropzone" class="dropzone" action="/front/source-pic/bulk-upload">
                        <div class="dropzone-previews">
                            <input type="hidden" class="price" name="price" min=0 step=0.01 value=0>
                        </div>
                    </form>
                    <div>
                        <div class="m">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

<!-- 全局js -->
<script src="/front/hAdmin/js/jquery.min.js?v=2.1.4"></script>
<script src="/front/hAdmin/js/bootstrap.min.js?v=3.3.6"></script>



<!-- 自定义js -->
<script src="/front/hAdmin/js/content.js?v=1.0.0"></script>


<!-- DROPZONE -->
<script src="/js/dropzone/dropzone.min.js"></script>


<script>
    jQuery(function($){
        try {
            $('#price').change(function() {
                var price=$(this).val();
                $('.price').val(price);
            });
            $(".dropzone").dropzone({
                paramName: "file", // The name that will be used to transfer the file
                maxFilesize: 10, // MB

                addRemoveLinks : true,
                dictDefaultMessage :
                    '<span class="bigger-150 bolder"><i class="icon-caret-right red"></i> Drop files</span> to upload \
                    <span class="smaller-80 grey">(or click)</span> <br /> \
                    <i class="upload-icon icon-cloud-upload blue icon-3x"></i>'
                ,
                dictResponseError: '上传文件过程中发生错误!',

                //change the previewTemplate to use Bootstrap progress bars
                previewTemplate: "<div class=\"dz-preview dz-file-preview\">\n  <div class=\"dz-details\">\n    <div class=\"dz-filename\"><span data-dz-name></span></div>\n    <div class=\"dz-size\" data-dz-size></div>\n    <img data-dz-thumbnail />\n  </div>\n  <div class=\"progress progress-small progress-striped active\"><div class=\"progress-bar progress-bar-success\" data-dz-uploadprogress></div></div>\n  <div class=\"dz-success-mark\"><span></span></div>\n  <div class=\"dz-error-mark\"><span></span></div>\n  <div class=\"dz-error-message\"><span data-dz-errormessage></span></div>\n</div>",
                sending: function(file, xhr, formData) {
                    formData.append("filesize", file.size);
                },
                success: function (file, response, e) {
                    if (response.state!='M00000') {
                        $(file.previewTemplate).children('.dz-error-mark').css('opacity', '1');
                        file.previewElement.classList.add("dz-error");
                        $(file.previewElement).find('.dz-error-message').text(response.message);
                    }else {
                        file.previewElement.classList.add("dz-success");
                        $(file.previewTemplate).children('.dz-success-mark').css('opacity', '1');
                    }
                }
            });
        } catch(e) {
            alert('当前浏览器版本太低，插件不支持此浏览器!');
        }

    });
</script>




</body>

</html>
